<template>
	<view class="page-box">
		<view class="login-logo">
			<image class="logo"
						 src="@/static/login_logo.png"></image>
		</view>
		<view class="form-box">
			<view class="form-tab">
				<tabHurdle :drawWidth="`145`" :drawHeight="`6`" v-bind:activeIndex.sync="activeIndex" :tab="['密码登录', '验证码登录']" class="tab">
					<view slot="tab-first" class="tab-first">
						<view class="tab-input">
							<view class="form-item">
								<view class="input-prefix">+86</view>
								<input placeholder="请输入邮箱号" placeholder-style="color:#D4D4D4" />
							</view>
							<view class="form-item">
								<view class="input-prefix">密码</view>
								<input placeholder="请输入登录密码" placeholder-style="color:#D4D4D4" />
							</view>
							<view v-if="show" class="tip-r">忘记密码</view>
						</view>
						<view class="btn">登录</view>
					</view>
					<view slot="tab-second" >2</view>
				</tabHurdle>
			</view>
		</view>
	</view>
</template>

<script>
import tabHurdle from '@/components/tab-hurdle/tab-hurdle.vue'
export default {
	components: {
		tabHurdle
	},
	data() {
		return {
			activeIndex: 0,
			show: false
		}
	}
}
</script>

<style lang="scss" scoped>
	page {
		background: #F4F5F7;
	}
</style>
